<style lang="scss" scoped>
@import '../../styles/common/loading.less';
.container{
    border: none !important;
    margin-top: 4px;
}
.el-col-offset-1 {
    margin-left: 0%;
}
.button_a {
    background-color: rgba(255, 138, 0, 1);
    border-color: rgba(255, 138, 0, 1);

}
.col_a {
    margin-left: 2%;
}
.el-card {
    height: 200px;
}

.el-button--primary {
    background-color: rgba(255, 138, 0, 1);
    border-color: rgba(255, 138, 0, 1);
}
</style>
<template>
    <div>
        <div class="container">
            <el-form :model="formInline"  class="select-submit-form">
                <el-row type="flex">
                     <el-col :span="8">
                        <el-form-item label="账户名称">
                            <el-input  v-model="formInline.payeeName"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="对公对私">
                            <el-select  placeholder="请选择" v-model="formInline.bankToPubPri">
                                <el-option value="" label="请选择"></el-option>
                                <el-option value="1" label="对公"></el-option>
                                <el-option value="2" label="对私"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="银行账户">
                            <el-input  v-model="formInline.bankNo"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="24">
                        <div class="select-btn-group">
                            <el-button type="primary" size="medium"  @click="handleSearch">查询</el-button>
                            <el-button type="primary" size="medium" @click="handleReset">重置</el-button>
                            <el-button type="primary" size="medium" @click="save()" >增加</el-button>
                        </div>
                    </el-col>
                </el-row>
            </el-form>
            <el-table
                :data="tableData"
                class="table"
                ref="multipleTable"
                header-cell-class-name="table-header"
                style="margin: 30px 0;border: 1px solid #d6d9d8;"
                v-loading="loading"
                element-loading-text="Loading....."
            >
                <el-table-column prop="payeeName" label="账户名称" align="center"></el-table-column>
                <el-table-column prop="bankNo" label="银行账户" align="center"></el-table-column>
                <el-table-column prop="bankToPubPri" label="对公对私" :formatter="formatBankToPubPri" align="center"></el-table-column>
                <el-table-column prop="bankBroad" label="银行大类" align="center"></el-table-column>
                <el-table-column prop="bankName" label="开户银行" align="center"></el-table-column>
                <el-table-column prop="phone" label="联系电话" align="center"></el-table-column>
                <el-table-column label="操作" width="auto" align="center">
                    <template slot-scope="scope">
                        <el-button size="mini"  type="text"  @click="handleLook(scope.$index, scope.row)">查看</el-button>
                        <el-button size="mini"  type="text"  @click="handleEdit(scope.$index, scope.row)">修改</el-button>
                        <el-button size="mini"  type="text"  @click="handleDelete(scope.$index, scope.row)">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div class="pagination" v-if="this.tableData.length!==0">
                <div class="index_page">
                    <el-pagination  :current-page="pagination.currentPage" :page-size="pagination.rowsNumber"
                                    :page-sizes="[10, 20, 50, 100]"
                                    :total="pagination.totalPage" background layout="prev, pager, next,sizes,total,jumper"
                                    @size-change="handleSizeChange" @current-change="queryFun">
                    </el-pagination>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import * as api from '@/api/baseDate';
import Cookies from 'js-cookie';
export default {
    name: 'accountInfo',
    data() {
        return {
            loading: false,
            pagination: {
                currentPage: 1, // 当前页
                rowsNumber: 10, // 每页条数
                totalPage: 0 // 总条数
            },
            formInline:{},
            editdiagnosisDetails:false,
            tableData: [],
            item:0,
            // 整个省市县数据
            city: [],
            // 被选中的市数据
            cityList: [],
            // 被选中的县数据
            areaList: [],
            accountInfoDemo:{}
        }
    },
    created() {
        this.handleSearch();
    },
    methods: {
        // 改变当前页条数事件
        handleSizeChange(pageSize){
            this.pagination.rowsNumber=pageSize
            this.handleSearch();
        },
        // 改变当前页事件
        queryFun(pageNum){
            this.pagination.currentPage=pageNum
            this.handleSearch();
        },
        // 按条件查询
        handleSearch() {
            var data = {
                ...this.queryItem,
                pageNum: this.pagination.currentPage,
                pageSize: this.pagination.rowsNumber,
                comCode: Cookies.get("makeCom"),
            }
            // 禁止重复点击
            if(this.loading){
                return;
            }
            this.loading = true;
            api.queryAccount(data
            ).then(res => {
            this.loading = false;
            if(res){
                if(res.data.resultCode !== '0000'){
                    this.$message.error(res.data.resultMsg);
                }else{
                    this.tableData = res.data.list;
                    this.pagination.totalPage=res.data.total;
                }
            }else{
                this.$message.error('系统异常');
            }
          })
        },
        // 重置
        handleReset(){
        },
        // 添加
        save(){
            this.$router.push({
                name: 'accountInfoDemo',
                query: {
                  accountInfoDemo: JSON.stringify(this.accountInfoDemo),
                  items: JSON.stringify(0),
                }
            })
        },
        // 查看
        handleLook(index,row){
          this.accountInfoDemo=row,
            this.$router.push({
              name: 'accountInfoSee',
              query: {
                accountInfoDemo: JSON.stringify(this.accountInfoDemo),
                item: JSON.stringify(2),
              }
            })
        },
        // 修改
        handleEdit(index,rew){
          this.accountInfoDemo=rew
          this.$router.push({
            name: 'accountInfoDemo',
            query: {
              accountInfoDemo: JSON.stringify(this.accountInfoDemo),
              items: JSON.stringify(1),
            }
          })
        },
        handleEditUpdate(){
          api.updateAccountById(this.form
          ).then(res => {
            if(res.data.resultCode){
              if(res.data.resultCode !== '0000'){
                this.$message.error(res.data.resultMsg);
              }else{
                this.$message.success(res.data.resultMsg);
              }
            }
            this.reload();
          })
        },
        // 删除
        handleDelete(index,rew){
          var data={
            "id":rew.id,
          }
          api.deleteAccountById(data
          ).then(res => {
            if(res.data.resultCode){
              if(res.data.resultCode !== '0000'){
                this.$message.error(res.data.resultMsg);
              }else{
                this.$message.success(res.data.resultMsg);
              }
            }
            this.reload();
          })
        },
        selectAreaFun (event) {
          console.log(event)
          this.$emit('getLawyerListInfo', [event.label, 'area'])
        },
        onSubmit() {
            this.$message.success('提交成功！');
        }
    },
    watch: {
        // 监听time的值
        editdiagnosisDetails: function (newVal) {
            if (newVal===false) {
              this.reload();
            }
        },
    }
}
</script>